<template>
    <div class="w-screen h-screen bg-slate-800 flex items-center justify-center">
        <n-card style="width: 400px;">
            <n-form :model="state.form" :rules="state.rules">
                <n-form-item label="账号" path="state.form.username">
                    <n-input v-model:value="state.form.username" type="text" placeholder="请输入" />
                </n-form-item>
                <n-form-item label="密码" path="state.form.password">
                    <n-input v-model:value="state.form.password" type="text" placeholder="请输入" />
                </n-form-item>
                <n-form-item>
                    <n-button type="primary" @click="submit">提交</n-button>
                </n-form-item>
            </n-form>
        </n-card>
    </div>
</template>

<script setup lang='ts'>
// import {NForm} from 'naive-ui';
import to from 'await-to-js';
import { ref, onMounted, reactive } from 'vue'
import { useRouter } from 'vue-router';
import { useUserStore } from '/@/store/modules/userStore';
// type ElFormInstance = InstanceType<typeof NForm>
const store = useUserStore()

const state = reactive({
    form: {
        username: 'admin',
        password: '111111',
    },
    rules: {

    }
})
const router = useRouter()

const submit = async () => {
    const [err]=await to( store.login(state.form)) 
    if(!err){
        router.replace({
            path:'/'
        })
    }

}

</script>

<style scoped>
</style>
